import React, { Component } from "react";

class CreateRef extends Component {
  username = React.createRef();
  div = React.createRef();
  showData = () => {
    console.log(this.username.current);
    let value = this.username.current.value;
    this.div.current.innerHTML = value;
  };
  render() {
    return (
      <>
        <h1>createRef() 方法创建ref</h1>
        <input type="text" ref={this.username} />
        <button onClick={this.showData}>点击显示</button>
        <div
          style={{
            width: "300px",
            height: "300px",
            border: "1px solid pink",
            wordBreak: "break-all",
          }}
          ref={this.div}
        ></div>
      </>
    );
  }
}

export default CreateRef;
